<template>
    <view class="content">
        <u-navbar id="navbar" bgColor="#fff" 
            :fixed="true" :shadow="true" :safeAreaInsetTop="true" :placeholder="true"
            leftIconColor="#151C24" @leftClick="back"
            title="问题反馈" titleColor="#151C24" >
        </u-navbar>
        <view class="uni-area box" :style="{height:boxH+'px'}">
            <u--textarea class="u-m-t-30 textarea" v-model="content" :autoHeight="false" :height="218"
                placeholder="请输入问题详情" placeholderClass="uni-placeholder">
            </u--textarea>
            <view class="u-m-t-30">
                <u-upload
                    width="100" height="100"
                    :fileList="fileList"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    name="file"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    uploadText="点击上传"
                ></u-upload>    
            </view>
            <u-button class="submit" type="primary" shape="circle" text="提交问题"></u-button>
        </view>
    </view>
</template>

<script>
export default {
    data(){
        return{
            systemInfo: uni.getStorageSync('systemInfo'),
            boxH: 768,
            content:'',
            fileList: [],
        }
    },

    onReady(){
        uni.createSelectorQuery().in(this).select('#navbar').boundingClientRect(res => {
            this.boxH = this.systemInfo.windowHeight - res.height
        }).exec();
    },

    methods: {
        back(){
            uni.navigateBack()
        },

        // 新增图片
        afterRead(event){},

        // 删除图片
        deletePic(event){}

    },
}
</script>

<style scoped lang="scss">
    .box{
        // background: $uni-text-color-inverse !important;
        border: 1rpx solid transparent;
        position: relative;
        // 文本域
        .textarea{
            border: none;
            padding: 40rpx 30rpx;
            background: #f4f5f7;
            border-radius: 16rpx;
        }
        // 上传
        /deep/.u-upload__button{
            border-radius: 10rpx;
            .u-upload__button__text{
                margin-top: 20rpx;
                font-size: 26rpx;
            }
        }
        // 提交
        .submit{
            width: 500rpx;
            position: absolute;
            left: 50%;
            margin-left: -250rpx;
            bottom: 80rpx;
        }
    }
</style>